<template>
  <div class="d-flex flex-wrap flex-grow-0 row">
    <el-card class=" p_c_test_border">
      <div slot="header">
        <span>服务器信息</span>
      </div>
      <el-table :data="[serveInfo.sysInfoDTO]">
        <el-table-column label="服务器名称" prop="computerName"></el-table-column>
        <el-table-column label="操作系统" prop="osName"></el-table-column>
        <el-table-column label="服务器IP" prop="computerIp"></el-table-column>
        <el-table-column label="系统架构" prop="osArch"></el-table-column>
      </el-table>
    </el-card>
    <el-card>
      <div slot="header">
        <span>Cpu信息</span>
      </div>
      <el-table :data="[serveInfo.cpuDto]">
        <el-table-column label="cpu核心数" prop="cpuNum"></el-table-column>
        <el-table-column label="total" prop="total"></el-table-column>
        <el-table-column label="sys" prop="sys"></el-table-column>
        <el-table-column label="user" prop="user"></el-table-column>
        <el-table-column label="free" prop="free"></el-table-column>
      </el-table>
    </el-card>
    <el-card class="p_c_test_border">
      <div slot="header">
        <span>内存信息</span>
      </div>
      <el-table :data="[serveInfo.memoryDTO]">
        <el-table-column label="total" prop="total"></el-table-column>
        <el-table-column label="used" prop="used"></el-table-column>
        <el-table-column label="free" prop="free"></el-table-column>
      </el-table>
    </el-card>
    <el-card>
      <div slot="header">
        <span>磁盘信息</span>
      </div>
      <div>
        <el-table :data="serveInfo.sysFiles">
          <el-table-column prop="dirName" label="dirName"></el-table-column>
          <el-table-column prop="sysTypeName" label="sysTypeName"></el-table-column>
          <el-table-column prop="typeName" label="typeName"></el-table-column>
          <el-table-column prop="total" label="total"></el-table-column>
          <el-table-column prop="free" label="free"></el-table-column>
          <el-table-column prop="used" label="used"></el-table-column>
        </el-table>
      </div>
    </el-card>
    <el-card>
      <div slot="header">
        <span>Jvm内存信息</span>
      </div>
      <el-table :data="[serveInfo.jvmMemoryDTO]">
        <el-table-column label="total" prop="total"></el-table-column>
        <el-table-column label="used" prop="used"></el-table-column>
        <el-table-column label="free" prop="free"></el-table-column>
        <el-table-column label="home" prop="home"></el-table-column>
        <el-table-column label="startTime" prop="startTime"></el-table-column>
        <el-table-column label="name" prop="name"></el-table-column>
        <el-table-column label="inputArgs" prop="inputArgs"></el-table-column>
      </el-table>
    </el-card>
  </div>
</template>

<script>
import {getJson} from "@/api/http";
import {systemInfo} from "@/api/api";

export default {
  name: "ImgType",
  data() {
    return {
      // 遮罩层
      serveInfo: ""
    };
  },
  created() {
    this.init()
  },
  methods: {
    async init() {
      let res = await getJson(systemInfo, {});
      this.serveInfo = res.data
    }
  }
}
</script>

<style scoped>

</style>